import React from "react";
import {View, Text} from "@tarojs/components";
import {AtIcon} from "taro-ui";
import classNames from "classnames"
import styles from './fileItem.module.scss'

interface Props {
  name:string
  path:string
  size:number
  icon:string
  onClick?:()=>void
}

interface State {
}

export class FileItem extends React.Component<Props, State> {
  constructor(args: Props | Readonly<Props>) {
    super(args);
  }
  componentWillMount () {
  }

  componentDidMount () { }

  componentWillUnmount () { }

  componentDidShow () { }

  componentDidHide () { }

  onClick():void {
    let onClick = this.props.onClick||(():void => void {});
    onClick();
  }

  render () {
    return (
      <View className={classNames(styles.layout, "line_ft")} onClick={this.onClick.bind(this)}>
        <AtIcon value={this.props.icon} size='30' color='#F00' />
        <View className={styles.content}>
          <Text className={classNames("fontmain")}>{this.props.name}</Text>
          <Text className={classNames("gray", "fontsmall")}>{this.props.path}</Text>
        </View>
        <Text className={classNames("gray", "fontsmall")}>{this.props.size}</Text>
      </View>
    )
  }
}

